* GtkScale *
************/
+%scale_trough {
+ border: 1px solid $borders_color;
+ border-radius: 3px;
+ background-color: $dark_fill;
+ box-shadow: inset 1px 1px transparentize(black, 0.9),
+ _widget_edge();
+
+ &:insensitive {
+ background-color: $insensitive_bg_color;
+ box-shadow: _widget_edge();
+ }
+
+ &:backdrop {
+ background-color: $backdrop_dark_fill;
+ border-color: $backdrop_borders_color;
+ box-shadow: none;
+ &:insensitive { background-color: $insensitive_bg_color; }
+ }
+
+ // ...on selected list rows
+ row:selected & {
+ box-shadow: none;
+
+ &, &:insensitive { border-color: $selected_borders_color; }
+ }
+
+ // OSD
+ .osd & {
+ border-color: $osd_borders_color;
+ background-color: transparentize($osd_borders_color, 0.2);
+ box-shadow: none;
+ outline-color: transparentize($osd_fg_color, 0.8);
+
+ &:insensitive { background-color: $osd_insensitive_bg_color; }
+ }
+}
+
+%scale_highlight {
+ border: 1px solid $selected_borders_color;
+ border-radius: 3px;
+ background-color: $selected_bg_color;
+
+ &:insensitive {
+ background-color: transparent;
+ border-color: transparent;
+ }
+
+ &:backdrop {
+ border-color: if($variant=='light', $selected_bg_color,
+ $selected_borders_color);
+ &:insensitive {
+ background-color: transparent;
+ border-color: transparent;
+ }
+ }
+
+ // ...on selected list rows
+ row:selected & { &, &:insensitive { border-color: $selected_borders_color; } }
+
+ // OSD
+ .osd & {
+ border-color: $osd_borders_color;
+ &:insensitive { border-color: transparent; }
+ }
+}
+
scale {
// FIXME: rationalize
-GtkScale-slider-length: 20;
&.vertical slider { margin: 0 2px; }
+ // the backing bit
trough { @extend %scale_trough; }
+ // the colored part of the backing bit
highlight { @extend %scale_highlight; }
+ // this is another differently styled part of the backing bit, the most relevant use case is for example
+ // in media player to indicate how much video stream as been cached
+ fill {
+ @extend %scale_trough;
+ &, &:backdrop {
+ background-color: $borders_color;
+ box-shadow: none;
+ }
+
+ &:insensitive {
+ &, &:backdrop {
+ border-color: transparent;
+ background-color: transparent;
+ }
+ }
+
+ // OSD
+ .osd & {
+ background-color: mix($osd_fg_color, $osd_borders_color, 25%);
+ &:insensitive {
+ &, &:backdrop {
+ border-color: transparent;
+ background-color: transparent;
+ }
+ }
+ }
+ }
+
slider {
// FIXME: scale-has-marks-* missing
$_slider_edge_color: transparentize(black, 0.9);
}
}
-%scale_trough {
- border: 1px solid $borders_color;
- border-radius: 3px;
- background-color: $dark_fill;
- box-shadow: inset 1px 1px transparentize(black, 0.9),
- _widget_edge();
-
- &:insensitive {
- background-color: $insensitive_bg_color;
- box-shadow: _widget_edge();
- }
-
- &:backdrop {
- background-color: $backdrop_dark_fill;
- border-color: $backdrop_borders_color;
- box-shadow: none;
- &:insensitive { background-color: $insensitive_bg_color; }
- }
-
- // ...on selected list rows
- row:selected & {
- box-shadow: none;
-
- &, &:insensitive { border-color: $selected_borders_color; }
- }
-
- // OSD
- .osd & {
- border-color: $osd_borders_color;
- background-color: transparentize($osd_borders_color, 0.2);
- box-shadow: none;
- outline-color: transparentize($osd_fg_color, 0.8);
-
- &:insensitive { background-color: $osd_insensitive_bg_color; }
- }
-}
-
-%scale_highlight {
- border: 1px solid $selected_borders_color;
- border-radius: 3px;
- background-color: $selected_bg_color;
-
- &:insensitive {
- background-color: transparent;
- border-color: transparent;
- }
-
- &:backdrop {
- border-color: if($variant=='light', $selected_bg_color,
- $selected_borders_color);
- &:insensitive {
- background-color: transparent;
- border-color: transparent;
- }
- }
-
- // ...on selected list rows
- row:selected & { &, &:insensitive { border-color: $selected_borders_color; } }
-
- // OSD
- .osd & {
- border-color: $osd_borders_color;
- &:insensitive { border-color: transparent; }
- }
-}
/*****************
* Progress bars *
/************
* GtkScale *
************/
+scale trough, scale fill, progressbar trough {
+ border: 1px solid #1c1f1f;
+ border-radius: 3px;
+ background-color: #2f3434;
+ box-shadow: inset 1px 1px rgba(0, 0, 0, 0.1), 0 1px rgba(238, 238, 236, 0.1); }
+ scale trough:insensitive, scale fill:insensitive, progressbar trough:insensitive {
+ background-color: #333636;
+ box-shadow: 0 1px rgba(238, 238, 236, 0.1); }
+ scale trough:backdrop, scale fill:backdrop, progressbar trough:backdrop, progressbar:backdrop trough {
+ background-color: #303535;
+ border-color: #1f2222;
+ box-shadow: none; }
+ scale trough:backdrop:insensitive, scale fill:backdrop:insensitive, progressbar trough:backdrop:insensitive, progressbar:backdrop trough:insensitive {
+ background-color: #333636; }
+ row:selected scale trough, scale row:selected trough, row:selected scale fill, scale row:selected fill, row:selected progressbar trough, progressbar row:selected trough {
+ box-shadow: none; }
+ row:selected scale trough, scale row:selected trough, row:selected scale fill, scale row:selected fill, row:selected progressbar trough, progressbar row:selected trough, row:selected scale trough:insensitive, scale row:selected trough:insensitive, row:selected scale fill:insensitive, scale row:selected fill:insensitive, row:selected progressbar trough:insensitive, progressbar row:selected trough:insensitive {
+ border-color: #0f2b48; }
+ .osd scale trough, scale .osd trough, .osd scale fill, scale .osd fill, .osd progressbar trough, progressbar .osd trough {
+ border-color: rgba(0, 0, 0, 0.7);
+ background-color: rgba(0, 0, 0, 0.5);
+ box-shadow: none;
+ outline-color: rgba(238, 238, 236, 0.2); }
+ .osd scale trough:insensitive, scale .osd trough:insensitive, .osd scale fill:insensitive, scale .osd fill:insensitive, .osd progressbar trough:insensitive, progressbar .osd trough:insensitive {
+ background-color: rgba(53, 57, 58, 0.5); }
+
+scale highlight, progressbar progress {
+ border: 1px solid #0f2b48;
+ border-radius: 3px;
+ background-color: #215d9c; }
+ scale highlight:insensitive, progressbar progress:insensitive {
+ background-color: transparent;
+ border-color: transparent; }
+ scale highlight:backdrop, progressbar progress:backdrop, progressbar:backdrop progress {
+ border-color: #0f2b48; }
+ scale highlight:backdrop:insensitive, progressbar progress:backdrop:insensitive, progressbar:backdrop progress:insensitive {
+ background-color: transparent;
+ border-color: transparent; }
+ row:selected scale highlight, scale row:selected highlight, row:selected progressbar progress, progressbar row:selected progress, row:selected scale highlight:insensitive, scale row:selected highlight:insensitive, row:selected progressbar progress:insensitive, progressbar row:selected progress:insensitive {
+ border-color: #0f2b48; }
+ .osd scale highlight, scale .osd highlight, .osd progressbar progress, progressbar .osd progress {
+ border-color: rgba(0, 0, 0, 0.7); }
+ .osd scale highlight:insensitive, scale .osd highlight:insensitive, .osd progressbar progress:insensitive, progressbar .osd progress:insensitive {
+ border-color: transparent; }
+
scale {
-GtkScale-slider-length: 20;
-GtkRange-slider-width: 24;
margin: 2px 0; }
scale.vertical slider {
margin: 0 2px; }
+ scale fill, scale fill:backdrop {
+ background-color: #1c1f1f;
+ box-shadow: none; }
+ scale fill:insensitive, scale fill:insensitive:backdrop {
+ border-color: transparent;
+ background-color: transparent; }
+ .osd scale fill {
+ background-color: rgba(91, 91, 90, 0.775); }
+ .osd scale fill:insensitive, .osd scale fill:insensitive:backdrop {
+ border-color: transparent;
+ background-color: transparent; }
scale slider {
color: #eeeeec;
outline-color: rgba(238, 238, 236, 0.3);
text-shadow: none;
-gtk-icon-shadow: none; }
-scale trough, progressbar trough {
- border: 1px solid #1c1f1f;
- border-radius: 3px;
- background-color: #2f3434;
- box-shadow: inset 1px 1px rgba(0, 0, 0, 0.1), 0 1px rgba(238, 238, 236, 0.1); }
- scale trough:insensitive, progressbar trough:insensitive {
- background-color: #333636;
- box-shadow: 0 1px rgba(238, 238, 236, 0.1); }
- scale trough:backdrop, progressbar trough:backdrop, progressbar:backdrop trough {
- background-color: #303535;
- border-color: #1f2222;
- box-shadow: none; }
- scale trough:backdrop:insensitive, progressbar trough:backdrop:insensitive, progressbar:backdrop trough:insensitive {
- background-color: #333636; }
- row:selected scale trough, scale row:selected trough, row:selected progressbar trough, progressbar row:selected trough {
- box-shadow: none; }
- row:selected scale trough, scale row:selected trough, row:selected progressbar trough, progressbar row:selected trough, row:selected scale trough:insensitive, scale row:selected trough:insensitive, row:selected progressbar trough:insensitive, progressbar row:selected trough:insensitive {
- border-color: #0f2b48; }
- .osd scale trough, scale .osd trough, .osd progressbar trough, progressbar .osd trough {
- border-color: rgba(0, 0, 0, 0.7);
- background-color: rgba(0, 0, 0, 0.5);
- box-shadow: none;
- outline-color: rgba(238, 238, 236, 0.2); }
- .osd scale trough:insensitive, scale .osd trough:insensitive, .osd progressbar trough:insensitive, progressbar .osd trough:insensitive {
- background-color: rgba(53, 57, 58, 0.5); }
-
-scale highlight, progressbar progress {
- border: 1px solid #0f2b48;
- border-radius: 3px;
- background-color: #215d9c; }
- scale highlight:insensitive, progressbar progress:insensitive {
- background-color: transparent;
- border-color: transparent; }
- scale highlight:backdrop, progressbar progress:backdrop, progressbar:backdrop progress {
- border-color: #0f2b48; }
- scale highlight:backdrop:insensitive, progressbar progress:backdrop:insensitive, progressbar:backdrop progress:insensitive {
- background-color: transparent;
- border-color: transparent; }
- row:selected scale highlight, scale row:selected highlight, row:selected progressbar progress, progressbar row:selected progress, row:selected scale highlight:insensitive, scale row:selected highlight:insensitive, row:selected progressbar progress:insensitive, progressbar row:selected progress:insensitive {
- border-color: #0f2b48; }
- .osd scale highlight, scale .osd highlight, .osd progressbar progress, progressbar .osd progress {
- border-color: rgba(0, 0, 0, 0.7); }
- .osd scale highlight:insensitive, scale .osd highlight:insensitive, .osd progressbar progress:insensitive, progressbar .osd progress:insensitive {
- border-color: transparent; }
-
/*****************
* Progress bars *
*****************/
/************
* GtkScale *
************/
+scale trough, scale fill, progressbar trough {
+ border: 1px solid #a1a1a1;
+ border-radius: 3px;
+ background-color: #d2d2d2;
+ box-shadow: inset 1px 1px rgba(0, 0, 0, 0.1), 0 1px white; }
+ scale trough:insensitive, scale fill:insensitive, progressbar trough:insensitive {
+ background-color: #f4f4f4;
+ box-shadow: 0 1px white; }
+ scale trough:backdrop, scale fill:backdrop, progressbar trough:backdrop, progressbar:backdrop trough {
+ background-color: #d5d5d5;
+ border-color: darkgray;
+ box-shadow: none; }
+ scale trough:backdrop:insensitive, scale fill:backdrop:insensitive, progressbar trough:backdrop:insensitive, progressbar:backdrop trough:insensitive {
+ background-color: #f4f4f4; }
+ row:selected scale trough, scale row:selected trough, row:selected scale fill, scale row:selected fill, row:selected progressbar trough, progressbar row:selected trough {
+ box-shadow: none; }
+ row:selected scale trough, scale row:selected trough, row:selected scale fill, scale row:selected fill, row:selected progressbar trough, progressbar row:selected trough, row:selected scale trough:insensitive, scale row:selected trough:insensitive, row:selected scale fill:insensitive, scale row:selected fill:insensitive, row:selected progressbar trough:insensitive, progressbar row:selected trough:insensitive {
+ border-color: #184472; }
+ .osd scale trough, scale .osd trough, .osd scale fill, scale .osd fill, .osd progressbar trough, progressbar .osd trough {
+ border-color: rgba(0, 0, 0, 0.7);
+ background-color: rgba(0, 0, 0, 0.5);
+ box-shadow: none;
+ outline-color: rgba(238, 238, 236, 0.2); }
+ .osd scale trough:insensitive, scale .osd trough:insensitive, .osd scale fill:insensitive, scale .osd fill:insensitive, .osd progressbar trough:insensitive, progressbar .osd trough:insensitive {
+ background-color: rgba(53, 57, 58, 0.5); }
+
+scale highlight, progressbar progress {
+ border: 1px solid #184472;
+ border-radius: 3px;
+ background-color: #4a90d9; }
+ scale highlight:insensitive, progressbar progress:insensitive {
+ background-color: transparent;
+ border-color: transparent; }
+ scale highlight:backdrop, progressbar progress:backdrop, progressbar:backdrop progress {
+ border-color: #4a90d9; }
+ scale highlight:backdrop:insensitive, progressbar progress:backdrop:insensitive, progressbar:backdrop progress:insensitive {
+ background-color: transparent;
+ border-color: transparent; }
+ row:selected scale highlight, scale row:selected highlight, row:selected progressbar progress, progressbar row:selected progress, row:selected scale highlight:insensitive, scale row:selected highlight:insensitive, row:selected progressbar progress:insensitive, progressbar row:selected progress:insensitive {
+ border-color: #184472; }
+ .osd scale highlight, scale .osd highlight, .osd progressbar progress, progressbar .osd progress {
+ border-color: rgba(0, 0, 0, 0.7); }
+ .osd scale highlight:insensitive, scale .osd highlight:insensitive, .osd progressbar progress:insensitive, progressbar .osd progress:insensitive {
+ border-color: transparent; }
+
scale {
-GtkScale-slider-length: 20;
-GtkRange-slider-width: 24;
margin: 2px 0; }
scale.vertical slider {
margin: 0 2px; }
+ scale fill, scale fill:backdrop {
+ background-color: #a1a1a1;
+ box-shadow: none; }
+ scale fill:insensitive, scale fill:insensitive:backdrop {
+ border-color: transparent;
+ background-color: transparent; }
+ .osd scale fill {
+ background-color: rgba(91, 91, 90, 0.775); }
+ .osd scale fill:insensitive, .osd scale fill:insensitive:backdrop {
+ border-color: transparent;
+ background-color: transparent; }
scale slider {
color: #2e3436;
outline-color: rgba(46, 52, 54, 0.3);
text-shadow: none;
-gtk-icon-shadow: none; }
-scale trough, progressbar trough {
- border: 1px solid #a1a1a1;
- border-radius: 3px;
- background-color: #d2d2d2;
- box-shadow: inset 1px 1px rgba(0, 0, 0, 0.1), 0 1px white; }
- scale trough:insensitive, progressbar trough:insensitive {
- background-color: #f4f4f4;
- box-shadow: 0 1px white; }
- scale trough:backdrop, progressbar trough:backdrop, progressbar:backdrop trough {
- background-color: #d5d5d5;
- border-color: darkgray;
- box-shadow: none; }
- scale trough:backdrop:insensitive, progressbar trough:backdrop:insensitive, progressbar:backdrop trough:insensitive {
- background-color: #f4f4f4; }
- row:selected scale trough, scale row:selected trough, row:selected progressbar trough, progressbar row:selected trough {
- box-shadow: none; }
- row:selected scale trough, scale row:selected trough, row:selected progressbar trough, progressbar row:selected trough, row:selected scale trough:insensitive, scale row:selected trough:insensitive, row:selected progressbar trough:insensitive, progressbar row:selected trough:insensitive {
- border-color: #184472; }
- .osd scale trough, scale .osd trough, .osd progressbar trough, progressbar .osd trough {
- border-color: rgba(0, 0, 0, 0.7);
- background-color: rgba(0, 0, 0, 0.5);
- box-shadow: none;
- outline-color: rgba(238, 238, 236, 0.2); }
- .osd scale trough:insensitive, scale .osd trough:insensitive, .osd progressbar trough:insensitive, progressbar .osd trough:insensitive {
- background-color: rgba(53, 57, 58, 0.5); }
-
-scale highlight, progressbar progress {
- border: 1px solid #184472;
- border-radius: 3px;
- background-color: #4a90d9; }
- scale highlight:insensitive, progressbar progress:insensitive {
- background-color: transparent;
- border-color: transparent; }
- scale highlight:backdrop, progressbar progress:backdrop, progressbar:backdrop progress {
- border-color: #4a90d9; }
- scale highlight:backdrop:insensitive, progressbar progress:backdrop:insensitive, progressbar:backdrop progress:insensitive {
- background-color: transparent;
- border-color: transparent; }
- row:selected scale highlight, scale row:selected highlight, row:selected progressbar progress, progressbar row:selected progress, row:selected scale highlight:insensitive, scale row:selected highlight:insensitive, row:selected progressbar progress:insensitive, progressbar row:selected progress:insensitive {
- border-color: #184472; }
- .osd scale highlight, scale .osd highlight, .osd progressbar progress, progressbar .osd progress {
- border-color: rgba(0, 0, 0, 0.7); }
- .osd scale highlight:insensitive, scale .osd highlight:insensitive, .osd progressbar progress:insensitive, progressbar .osd progress:insensitive {
- border-color: transparent; }
-
/*****************
* Progress bars *
*****************/